<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:include="common/common::common_head('首页')"></head>
<head>
    <link rel="stylesheet" th:href="@{/css/front/index.css}">
    <script th:src="@{/js/front/index.js}"></script>
</head>
<body>
    <!-- 引入公共的导航栏部分 -->
    <header th:include="common/common::common_header('index','驾校一点通')"></header>
    <!-- 页面轮播图部分 -->
    <article>
        <div class="layui-carousel" id="slideshow">
            <div carousel-item>
                <div><img th:src="@{/image/front/1.png}" alt="这是一张轮播图"></div>
                <div><img th:src="@{/image/front/2.jpg}" alt="这是一张轮播图"></div>
                <div><img th:src="@{/image/front/3.jpg}" alt="这是一张轮播图"></div>
            </div>
        </div>
    </article>

    <!-- 小车理论考试部分 -->
    <div class="layui-container">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12" style="text-align: center">
                <h1>小车理论考试</h1>
            </div>
        </div>
        <br><br><br>
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md6">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <h1>科目一交规</h1>
                    </div>
                    <div class="layui-card-body">
                        <a th:href="@{/page/subjectOneSequence}" class="layui-btn a-button">顺序练习</a>
                        <a th:href="@{/page/subjectOneRandom}" class="layui-btn a-button">随机练习</a><br><br>
                        <a th:href="@{/page/subjectOneSpecial}" class="layui-btn a-button">专项练习</a>
                        <a th:href="@{/page/subjectOneMistakable}" class="layui-btn a-button">易错题练习</a><br><br><br>
                        <a th:href="@{/page/subjectOneTest}" class="layui-btn a-button-test">模拟考试</a>
                    </div>
                </div>
            </div>
            <div class="layui-col-md6">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <h1>科目四安全文明驾驶</h1>
                    </div>
                    <div class="layui-card-body">
                        <a th:href="@{/page/subjectFourSequence}" class="layui-btn a-button">顺序练习</a>
                        <a th:href="@{/page/subjectFourRandom}" class="layui-btn a-button">随机练习</a><br><br>
                        <a th:href="@{/page/subjectFourSpecial}" class="layui-btn a-button">专项练习</a>
                        <a th:href="@{/page/subjectFourMistakable}" class="layui-btn a-button">易错题练习</a><br><br><br>
                        <a th:href="@{/page/subjectFourTest}" class="layui-btn layui-btn-lg a-button-test">模拟考试</a>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <!-- 驾校陪练排行 -->
    <div class="layui-container">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12" style="text-align: center">
                <h1>驾校陪练排行</h1>
            </div>
        </div>
        <br><br><br>
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <h2>驾校排行榜</h2>
                    </div>
                    <div class="layui-card-body">
                        <div style="padding: 0 15px;">
                            <a href="www.baidu.com"><img th:src="@{/image/front/4.jpg}" height="200" alt="这是一张图片"></a>
                            <hr>
                            <p><span style="font-size: 18px;">安行驾校</span></p>
                            <p><div id="comment_school"></div></p>
                            <p><span>165615点评</span></p>
                        </div>
                        <hr>
                        <table class="layui-table" lay-skin="nob">
                            <tbody>
                            <tr>
                                <td>安生中海驾校</td>
                                <td>88分</td>
                                <td>159632点评</td>
                            </tr>
                            <tr>
                                <td>光宇驾校</td>
                                <td>85分</td>
                                <td>145698点评</td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="layui-card-header" style="height: 40px;line-height: 40px;">查看更多</div>
                </div>
            </div>
            <div class="layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <h2>教练排行榜</h2>
                    </div>
                    <div class="layui-card-body">
                        <div style="padding: 0 15px;">
                            <a href="www.baidu.com"><img th:src="@{/image/front/5.jpg}" height="200" alt="这是一张图片"></a>
                            <hr>
                            <p><span style="font-size: 18px;">喜欢编程的代先生</span></p>
                            <p><div id="comment_coach"></div></p>
                            <p><span>所属驾校：马路杀手驾校</span></p>
                        </div>
                        <hr>
                        <table class="layui-table" lay-skin="nob">
                            <tbody>
                            <tr>
                                <td>陈志勇</td>
                                <td>159632点评</td>
                            </tr>
                            <tr>
                                <td>徐金帅</td>
                                <td>16368点评</td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="layui-card-header" style="height: 40px;line-height: 40px;">查看更多</div>
                </div>
            </div>
            <div class="layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <h2>陪练排行榜</h2>
                    </div>
                    <div class="layui-card-body">
                        <div style="padding: 0 15px;">
                            <a href="www.baidu.com"><img th:src="@{/image/front/6.jpg}" height="200" alt="这是一张图片"></a>
                            <hr>
                            <p><span style="font-size: 18px;">喜欢编程的代先生</span></p>
                            <p><div id="comment_ranking"></div></p>
                            <p><span>所属驾校：马路杀手驾校</span></p>
                        </div>
                        <hr>
                        <table class="layui-table" lay-skin="nob">
                            <tbody>
                            <tr>
                                <td>纪建国</td>
                                <td>159632点评</td>
                            </tr>
                            <tr>
                                <td>王师傅</td>
                                <td>16368点评</td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="layui-card-header" style="height: 40px;line-height: 40px;">查看更多</div>
                </div>
            </div>
        </div>
    </div>

    <!-- 去入住的图片 -->
    <div class="layui-carousel">
        <img th:src="@{/image/front/2.png}" width="100%" alt="这是一张图片">
    </div>
    <hr>

    <!-- 公共的底部部分 -->
    <div th:replace="~{/common/common :: footer-common}"></div>
</body>
</html>